<template>
  <div >
    <div >
      <h2 style="text-align: center">密码修改界面</h2>
      <el-form ref="form" label-width="100px">
        <el-form-item label="旧密码：">
          <el-input placeholder="请输入旧密码" v-model="oldpassword" type="password"></el-input>
        </el-form-item>
        <el-form-item label="新密码：">
          <el-input placeholder="请输入新密码" v-model="newpassword" type="password"></el-input>
        </el-form-item>
        <el-form-item label="确认新密码：">
          <el-input placeholder="请输入确认新密码" v-model="confirmpassword" type="password"></el-input>
        </el-form-item>
        <el-row style="text-align: center">
          <el-button @click="changepassword">修改</el-button>
          <el-button @click="returnlogin">返回首页</el-button>
        </el-row>


      </el-form>
    </div>
  </div>
</template>

<script>
  export default {
    name: "changepassword",
    data(){
      return{
        userId:window.sessionStorage.getItem("userId"),
        oldpassword:"",
        newpassword:"",
        confirmpassword:"",
        verifycode:""
      }

    },
    methods: {
      returnlogin(){
        this.$store.commit("setviewPage",1);
        this.$router.push({path: '/home'});
      },

      changepassword()
      {

        if(this.userId==""||this.oldpassword==""||this.confirmpassword==""||this.newpassword=="")
        {

          this.userId=""
          this.oldpassword=""
          this.newpassword=""
          this.confirmpassword=""
          return this.$message.error("信息不全，请重试");
        }
        else if(this.confirmpassword!=this.newpassword)
        {
          this.newpassword=""
          this.confirmpassword=""
          return this.$message.error("确认密码和新密码不一致!");
        }
        else if (this.oldpassword == this.newpassword||this.oldpassword == this.confirmpassword)
        {
          return this.$message.error("旧密码和新密码一致!");
        }
        this.$axios.post("/changepassword",
          {
            userId:this.userId,
            oldPassword:this.oldpassword,
            newPassword:this.newpassword
          }).then((res)=>{
          if(res.data.msg=="success"&&res.status == 200)
          {
            this.$axios.post("/deletepasswordrequest",{
              userId:this.userId
            }).then((ress)=>{
              if (ress.data.msg == "success"&&res.status == 200)
              {
                this.$router.push({path: '/'})
                this.$store.commit("setviewPage",1);
                window.sessionStorage.clear()
                return this.$message.success("修改成功，忘记密码请求已撤销，已自动返回首页！")
              }
              this.$router.push({path: '/'})
              this.$store.commit("setviewPage",1);
              window.sessionStorage.clear()
              return this.$message.success("修改成功，已自动返回登录界面！")
            })

          }
          else if(res.data.msg =="falseoldpassword")
          {

            this.userId=""
            this.oldpassword=""
            this.newpassword=""
            this.confirmpassword=""
            return this.$message.error("旧密码或用户名错误！");
          }
          else if(res.data.msg == "missingfail")
          {
            return this.$message.error("服务超时，请重试！");
          }

        })

      }
    }
  }
</script>

<style scoped>
  #mainloginFrame{
    position: absolute;
    width: 71%;
    height: 100%;
    background-color: #42b983;
  }
  #logincss{
    width: 350px;
    margin-top: 10px;
    margin-left: 160px;
    background-color: rgb(255, 255, 255); /* 透明背景色 */
    padding: 30px;
    border-radius: 20px; /* 圆角 */
  }


  a:link {
    color: #330099;
    text-decoration: none;
  }
  a:visited {
    text-decoration: none;
  }
  a:hover {
    text-decoration: underline;
    color: #FF0000;
  }
  a:active {
    text-decoration: none;
  }
</style>
